<template>
    <div>
        <img v-if="item.type === 'img'" :src="row[item.field]" height="60">
        <el-tag
                v-if="item.type === 'tag'"
                :type="tagTpye[row[item.field]]"
        >{{item.options[row[item.field]]}}
        </el-tag>
        <el-switch
                v-if="item.type === 'switch'"
                v-model="row[item.field]"
                :active-value="1"
                :inactive-value="0"
                @change="switchItem"
        ></el-switch>
        <div v-else-if="item.type === undefined">
            <div>{{fullVal}}</div>
        </div>
    </div>
</template>

<script>
    export default {
        name: "BwColumn",
        props: {
            row:{
                type:Object,
                default:[]
            },
            item:{
                type:Object,
                default:null
            }
        },
        data() {
            return {
                tagTpye: ["danger", "primary", "success"],
            };
        },
        computed:{
          fullVal(){
              if(this.item.type === undefined){
                  if(this.item.enum){
                      return this.item.enum[this.row[this.item.field]]
                  }else if(this.item.field.includes('.')){
                      let keys = this.item.field.split(".");
                      if(this.row[keys[0]]){
                          return this.row[keys[0]][keys[1]]
                      }
                      return ''
                  }else {
                      return this.row[this.item.field]
                  }
              }
          }
        },
        mounted() {
           //console.log(this.row,this.item)
        },
        methods: {
            switchItem(val) {
                this.$emit('update', this.row)
            },
        },
    };
</script>